<svelte:options tag="my-clock" />

<div class="my-clock">{ date || '' }</div>

<script>
  import { onMount, onDestroy } from 'svelte';
  let date = new Date().toLocaleTimeString();
  let interval;

  onMount(() => {
    interval = setInterval(() => {
      date = new Date().toLocaleTimeString()
    }, 1000);
  });

  onDestroy(() => {
    clearInterval(interval);
  });
</script>



<style lang="scss">
  .my-clock {
    font-size: 1rem;
    color: #ff3e00;
    position: absolute;
    top: 1rem;
    right: 1rem;
    z-index: 99;
  }
</style>